section.col-xs-12.content(ng-controller="TrustCtrl")

  //- Disconnected

  group.disconnected(ng-hide="connected")
    p.literal(l10n) You have to be online to see this screen

  group.disconnected(ng-hide="!connected || loadState.lines")
    p.literal(l10n) Loading...

  //- Connected

  group(ng-show="connected && loadState.lines")
    div(ng-show="!loadingAccount && !account.Balance && loadState.account && connected")
      include ../tabs/banner/unfunded

    div(ng-show='hasRTJapanTrust')
      include banner/rtjapan
    div(ng-show='hasRTJapanTrustWithRippling')
      include banner/rtjapanrippling

    //- N1. Trust form
    .row
      // Transaction errors coming from errors.js & transactionerror.jade
      .col-sm-12(ng-show='account.Balance')
        group.mode-ripplerror
          rp-transaction-status(
            rp-engine-result="{{engine_result}}"
            rp-engine-result-message="{{engine_result_message}}"
            rp-accepted="{{engine_status_accepted}}"
            rp-current-tab="trust")

      //- N5. Notifications for edit/removing account
      .col-sm-12(ng-show='notif !== "clear"', ng-hide='!notif')
        group.mode-granted.wide
          group(ng-switch="notif")
            group.pending(ng-switch-when="remove_gateway")
              h2.tx-status(l10n) Removing gateway...
            group.result-success(ng-switch-when="gateway_removed")
              h2.tx-status(l10n) Gateway removed.
            group.result-success(ng-switch-when="changes_saved")
              h2.tx-status(l10n) Your changes have been saved.
            group.result-error(ng-switch-when="max_fee")
              h2.tx-status(l10n) Request failed.
              p(l10n) This request failed because the current network fee is higher than your account limit. You can adjust your maximum network fee in Settings &gt Advanced, or try again later. <br>
                | Error code: Network fee exceeded [tejMaxFeeExceeded].
            group.result-error(ng-switch-when="unlock_failed")
              h2.tx-status(l10n) Account unlock failed.
              p(l10n) Your account could not be unlocked. Please try again later.
            group.result-error(ng-switch-when="error")
              h2.tx-status(l10n) There was an error while saving your changes.&#32;
              p(l10n) Please try again later.
      .col-sm-12(ng-show='addform_visible && !can_add_trust')
        .alert.alert-warning(l10n) You must have at least
          strong  {{account.reserve_to_add_trust | rpamount:0}} XRP
          |  to add a new trust line.&#32;
          a(href="https://ripple.com/wiki/Reserves", target="_blank") More information
    .row(ng-show='connected')
      .trust-menu
        .row.row-padding-small.head(ng-hide='true')
          .col-sm-5(l10n) Name / Address
          .col-sm-2
            a(href="", ng-click="sorting.predicate = 'currency'; sorting.reverse=!sorting.reverse", l10n) Currency
          .col-sm-2
            a(href="", ng-click="sorting.predicate = 'balance'; sorting.reverse=!sorting.reverse", l10n) Balance
          .col-sm-2(l10n) Trust Limit
        .row
          .col-xs-12
            form.row-padding-small#trustForm(name='trustForm',
              ng-show='mode=="main" && (addform_visible && can_add_trust)')
              .row
                .col-xs-12.col-sm-10.col-md-9.form-group
                  label(for='trust_counterparty', l10n) Gateway's Ripple name or address
                  input.form-control#trust_counterparty(
                    name='trust_counterparty', type='text', rp-combobox="counterparty_query"
                    rp-combobox-value-as-ripple-name
                    ng-model='counterparty_view'
                    rp-account-exists
                    rp-dest, rp-dest-address, rp-dest-contact, rp-not-me, rp-dest-email
                    rp-dest-ripple-name, rp-dest-model="counterparty"
                    rp-dest-loading="counterparty_loading"
                    required
                    rp-autofill='$routeParams.to'
                    rp-autofill-counterparty_view
                    rp-autofill-on='addform_visible = true'
                    rp-focus, rp-spinner="{{counterparty_loading ? 4 : null}}")
                  .errorGroup(ng-messages='trustForm.trust_counterparty.$dirty && trustForm.trust_counterparty.$error')
                    div(ng-show='trustForm.trust_counterparty.$valid')
                      .success(ng-show='counterparty != counterparty_address && counterparty_name && !error_account_reserve')
                        | {{counterparty_address}}
                      .error(ng-show='error_account_reserve')
                        span(l10n) This account does not meet the minimum XRP reserve, so you cannot use it as a gateway.
                    .error(ng-message='required', l10n) Please enter a Ripple name, contact, or address.
                    .error(ng-message='rpNotMe', l10n) You've entered your own address.
                    .error(ng-message='rpDest', l10n) Please enter a valid Ripple name, contact, or address.
                    .error(ng-message='rpAccountExists', l10n) You cannot add an unfunded Ripple account as a gateway.
              .row
                .col-xs-12.form-group
                  label(for='trust_amount', ng-show="globalOptions.advanced_feature_switch", l10n) Amount
                  label(for='trust_amount', ng-hide="globalOptions.advanced_feature_switch", l10n) Currency
                  .row(ng-show="globalOptions.advanced_feature_switch")
                    .col-md-3.col-sm-4.col-xs-3(ng-init="amount = $routeParams.amount ? '' : 1000000000")
                      input.form-control.value#trust_amount(name='trust_amount'
                        type='text', step='any', ng-model='amount'
                        rp-autofill='$routeParams.amount'
                        rp-autofill-amount
                        rp-amount
                        rp-amount-positive
                        rp-max-digits
                        rp-amount-currency='{{amount}}'
                        rp-autofill-on='addform_visible = true')
                    .col-md-6.col-sm-6.col-xs-9
                      input.form-control.currency-field#trust_amount_currency(name='trust_amount_currency', type='text'
                        ng-model='currency', rp-combobox="currency_query", rp-combobox-select
                        rp-autofill='$routeParams.currency || $routeParams.amount'
                        rp-autofill-currency
                        rp-autofill-on='addform_visible = true'
                        rp-not-xrp
                        required)
                  .row(ng-hide="globalOptions.advanced_feature_switch")
                    .col-md-9.col-sm-10.col-xs-12
                      input.form-control.currency-field#trust_amount_currency(name='trust_amount_currency', type='text'
                        ng-model='currency', rp-combobox="currency_query", rp-combobox-select
                        rp-autofill='$routeParams.currency || $routeParams.amount'
                        rp-autofill-currency
                        rp-autofill-on='addform_visible = true'
                        rp-not-xrp
                        required)
                  .errorGroup(ng-messages='trustForm.trust_amount.$dirty && trustForm.trust_amount.$error')
                    .error(ng-message='required', l10n) Amount field is required.
                    .error(ng-message='rpAmount', l10n) Not a valid amount.
                    .error(ng-message='rpAmountPositive', l10n) Amount must be greater than zero.
                    .error(ng-message='rpMaxDigits', l10n) Your amount has too many digits. The max number of digits is 16.
                  .errorGroup(ng-messages='trustForm.trust_amount_currency.$dirty && trustForm.trust_amount_currency.$error')
                    .error(ng-message='rpNotXrp', l10n)
                      | XRP can be sent without extending trust. If you really want
                      |  to trust in XRP, please use XRR currency code.
                    .error(ng-message='required', l10n)
                      | Currency field is required
              .row(ng-show="globalOptions.advanced_feature_switch")
                .col-xs-12.allow-rippling
                  label.checkbox(for="trust_allowrippling")
                    input#trust_allowrippling(
                      name='trust_allowrippling', type='checkbox'
                      ng-model='allowrippling')
                    span(l10n) Allow Rippling
                  i.fa.fa-question-circle.help-icon(
                    rp-popover
                    rp-popover-placement="bottom"
                    l10n-rp-popover-title="Allow Rippling"
                    rp-popover-trigger="click"
                    l10n-data-content="Allow this trust line's balances to be transferred to another issuer you connect to. <a href=https://ripple.com/wiki/No_Ripple target=_blank>More information</a>")
              .row
                .col-xs-8.col-sm-7.col-md-6
                  rp-popup(rp-popup-on-open="grant()")
                    a.btn.btn-block.btn-primary.submit(href="", rp-popup-link, ng-disabled='trustForm.$invalid || trustForm.$pending || verifying', l10n) Save
                    div.connectModal(rp-popup-content)
                      .modal-header
                        .navbar-brand.hidden-sm.modal-logo#logo
                        .modal-title(l10n) Connect
                      .modal-body
                        div.modal-prompt(l10n)
                          div(l10n-inc) You are connecting a gateway, which means
                          div(l10n-inc) {{ counterparty_address | rpripplename:{tilde: true} }} can:
                        div.grey-focus(ng-show="globalOptions.advanced_feature_switch", l10n)
                          span.modal-permissions(l10n-inc) - Hold up to&#32;
                          span(rp-pretty-amount="amount_feedback")
                          span.modal-permissions(l10n-inc)  on your behalf
                        div.grey-focus(ng-hide="globalOptions.advanced_feature_switch", l10n)
                          span.modal-permissions(l10n-inc) - Hold&#32;
                          span {{ currency }}
                          span.modal-permissions(l10n-inc)  on your behalf
                        div.modal-buttons
                          button.modal-btn.btn.btn-default.btn-success.btn-md(data-dismiss="modal", ng-click="grant_confirmed()",
                            ng-disabled="loading")
                            img(src="img/button-s.png", class="loader", ng-show="loading")
                            span(class="loading_text", ng-show="loading", l10n) Loading...
                            span(ng-hide="loading", l10n) Confirm
                          button.modal-btn.btn.btn-cancel.btn-md.btn-cancel(data-dismiss="modal",
                            ng-click='toggle_form()', ng-hide="loading", l10n) cancel
                .col-xs-4.col-sm-3.col-md-3
                  button.btn.btn-block.btn-cancel(type="button", ng-click='toggle_form()', l10n) cancel
              .row
                .col-xs-12
                  p.literal.verifying(ng-show="verifying")
                    img(src="img/button-s.png", class="loader")
                    span(class="loading_text", l10n) Verifying address

        .row
          .unfunded.literal(ng-hide='account.Balance', l10n)
            | Your account has to be&#32;
            a(href="https://ripple.com/knowledge_center/activating-your-wallet/", target="_blank", l10n-inc) activated
            | &#32;before you can add a gateway account.

        //- Account is funded
        .row
          .col-xs-12.col-sm-4.col-md-3.actions.btn-add-trust
            a.btn.btn-primary.btn-sm.btn-block.sign(ng-click='toggle_form()', ng-show='!addform_visible && account.Balance',
            ng-disabled='addform_visible', l10n) Connect gateway

        .currencyBox(ng-repeat="entry in accountLines", ng-class="'currency-' + (entry.components[0].balance._currency._iso_code | lowercase)")
          .row.currencyTitle
            .col-xs-12
              i(class="icon fa fa-money", ng-class="'fa-' + (entry.components[0].currency | lowercase)")
              span.currency(rp-currency="entry.components[0].limit", rp-currency-full)
          .row.head.hidden-xs.hidden-sm
            div(
              ng-class="{ 'col-md-2': globalOptions.advanced_feature_switch, 'col-md-5': !globalOptions.advanced_feature_switch }"
              l10n) Gateway
            div(
              ng-class="{ 'col-md-2': globalOptions.advanced_feature_switch, 'col-md-4': !globalOptions.advanced_feature_switch }"
              l10n) Balance
            div.col-md-3(ng-show="globalOptions.advanced_feature_switch", l10n) Limit
            div.col-md-1(ng-show="globalOptions.advanced_feature_switch", l10n) Min
            div.col-md-2(ng-show="globalOptions.advanced_feature_switch", l10n) Rippling
            div(ng-class="{'col-md-2' : globalOptions.advanced_feature_switch, 'col-md-3': !globalOptions.advanced_feature_switch }"
              l10n) Edit
          hr#divider
          .lines
            .line(ng-controller="AccountRowCtrl", ng-repeat="component in entry.components")
              .row(ng-class="{ 'frozen-account': component.freeze_peer }")
                .col-xs-full
                  .gateway(ng-class="{ 'col-md-2': globalOptions.advanced_feature_switch, 'col-md-5': !globalOptions.advanced_feature_switch }",
                    l10n-data-label="Gateway"
                    )
                    span(rp-pretty-identity="component.account", rp-pretty-identity-filters="rpcontactnamefull | rpripplename: {tilde: true}",
                      rp-address-popover="component.account"
                      )
                  div(ng-class="{ 'col-md-2': globalOptions.advanced_feature_switch, 'col-md-4': !globalOptions.advanced_feature_switch }",
                    l10n-data-label="Balance"
                    )
                    span(rp-address-popover, rp-address-popover-sum="component.balance") {{ component.balance | rpamount:{rel_precision: 2} }}
                  .col-md-3(ng-show="globalOptions.advanced_feature_switch",
                    l10n-data-label="Limit"
                    )
                    span(rp-address-popover, rp-address-popover-sum="component.limit") {{ component.limit | rpamount }}
                  .col-md-1(ng-show="globalOptions.advanced_feature_switch && component.limit_peer.is_zero()",
                    l10n-data-label="Min"
                    )
                    span(rp-address-popover, rp-address-popover-sum="component.limit_peer") {{ component.limit_peer | rpamount }}
                  .col-md-1(
                      ng-show="globalOptions.advanced_feature_switch && !component.limit_peer.is_zero()",
                      ng-hide="component.limit_peer.is_zero() || !globalOptions.advanced_feature_switch",
                      l10n-data-label="Min"
                      )
                    span(rp-address-popover, rp-address-popover-sum="component.limit_peer", rp-address-popover-sum-minus) -{{ component.limit_peer | rpamount }}
                  .col-md-2(ng-show="globalOptions.advanced_feature_switch",
                    l10n-data-label="Rippling"
                    )
                    div(ng-show="component.no_ripple", l10n) Off
                    div(ng-hide="component.no_ripple", l10n) On
                  div(ng-hide="component.freeze_peer", ng-class="{ 'col-md-2': globalOptions.advanced_feature_switch, 'col-md-3': !globalOptions.advanced_feature_switch }")
                    span.visible-xs.visible-sm(ng-hide="editing")
                      a.btn.btn-cancel(href="", ng-click="edit_account()"
                      l10n) edit
                    a.hidden-xs.hidden-sm(href="", ng-hide="editing", ng-click="edit_account()"
                      l10n) edit
                    span(ng-show="editing && !globalOptions.advanced_feature_switch")
                      .col-xs-6.col-sm-5(ng-show="trust.loading && trust.state==='removing'")
                        .row
                          .col-xs-16
                            button.btn.btn-block.btn-danger(disabled, l10n) Removing...
                      span(ng-hide="trust.loading")
                        div.row.row-padding-small
                          .col-md-7.col-sm-7.col-xs-6
                            span(ng-show='trust.balance !== "0" && orderbookStatus === "exists"')
                              rp-confirm(
                              action-text="Are you sure you want to remove this gateway? Ripple Trade will attempt to convert the remaining balance of {{ trust.balance }} {{ trust.currency }} into XRP. This action can't be undone."
                              action-button-text="Convert balance and remove"
                              action-button-css="btn btn-default btn-danger custom-btn"
                              action-function="delete_account()"
                              cancel-button-css="btn btn-cancel"
                              cancel-button-text="cancel"
                              ng-hide="showPassword==true")
                                button.btn.btn-block.btn-danger.submit(type="button", ng-click="load_orderbook()", ng-show="!isIncomingOnly()", l10n) Remove
                                span(
                                  rp-popover
                                  rp-popover-placement="bottom"
                                  rp-popover-trigger="hover"
                                  l10n-rp-popover-title="Incoming trust"
                                  l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                  button.btn.btn-block.btn-danger.submit(type="button", ng-click="load_orderbook()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                            span(ng-show='trust.balance !== "0" && orderbookStatus === "not"')
                              rp-confirm(
                              action-text="Are you sure you want to remove this gateway? Ripple Trade will return the balance of {{ trust.balance }} {{ trust.currency }} to the issuer. This action can't be undone."
                              action-button-text="Return balance and remove"
                              action-button-css="btn btn-default btn-danger custom-btn"
                              action-function="delete_account()"
                              cancel-button-css="btn btn-cancel"
                              cancel-button-text="cancel"
                              ng-hide="showPassword==true")
                                button.btn.btn-block.btn-danger.submit(type="button", ng-click="load_orderbook()", ng-show="!isIncomingOnly()", l10n) Remove
                                span(
                                  rp-popover
                                  rp-popover-placement="bottom"
                                  rp-popover-trigger="hover"
                                  l10n-rp-popover-title="Incoming trust"
                                  l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                  button.btn.btn-block.btn-danger.submit(type="button", ng-click="load_orderbook()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                            span(ng-show='trust.balance === "0"')
                              button.btn.btn-block.btn-danger.submit(type="button", ng-click="delete_account()", ng-show="!isIncomingOnly()", l10n) Remove
                              span(
                                rp-popover
                                rp-popover-placement="bottom"
                                rp-popover-trigger="hover"
                                l10n-rp-popover-title="Incoming trust"
                                l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                button.btn.btn-block.btn-danger.submit(type="button", ng-click="delete_account()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                          .col-md-5.col-sm-5.col-xs-6
                            a.btn.btn-block.btn-cancel(href="", ng-click="cancel()"
                            ng-disabled="trust.loading", l10n) cancel

                //- Account Freeze
                div.col-xs-2(ng-show="component.freeze_peer")
                  i.fa.fa-lock(
                    rp-popover
                    rp-popover-placement="bottom"
                    rp-popover-title='Account Frozen'
                    rp-popover-trigger="click"
                    data-content='This account has been frozen. Please contact the issuer to unfreeze your account. <a href=https://ripple.com/wiki/Freeze target=_blank>More about freezing</a>')
              .row.row-padding-small-xs.editBox(ng-show="editing && globalOptions.advanced_feature_switch")
                form(ng-class="{ 'frozen-account': component.freeze_peer }"
                  ng-submit="save_account()")
                  ng-form(name="accountForm")
                    .col-sm-1.col-md-1.inputPadding(l10n) Limit
                    .col-sm-2.col-md-3
                      input.form-control(name='limit', type='text'
                        ng-model='trust.limit'
                        rp-amount
                        rp-max-digits
                        rp-amount-currency='{{trust.limit}}'
                        ng-disabled='trust.loading', required)
                    .col-sm-2.col-md-2.inputPadding
                      div.rippling-checkbox
                        label(l10n) Rippling&#32;
                          input(name='rippling', type='checkbox', ng-model='trust.rippling', ng-disabled='trust.balance !== "0" && isIncomingOnly() && ripplingEnabled()')
                    .col-sm-7.col-md-6
                      .row.row-padding-small
                        div(ng-hide="trust.loading && trust.state==='removing'")
                          .col-xs-6.col-sm-5(ng-hide='showEnableRipplingWarningMessage()')
                            button.btn.btn-block.btn-primary#save(type='submit'
                              ng-disabled='accountForm.$invalid || trust.loading')
                              span(ng-hide="trust.loading", l10n) Save
                              span(ng-show="trust.loading && trust.state==='saving'", l10n) Saving...
                          .col-xs-6.col-sm-5(ng-show='showEnableRipplingWarningMessage()')
                            rp-confirm(
                            action-text="Are you sure you want to enable rippling? This is an incoming trust line with a balance. If you enable rippling, you will not be able to disable it."
                            action-button-text="Enable rippling and save"
                            action-button-css="btn btn-default btn-danger"
                            action-function="save_account()"
                            cancel-button-css="btn btn-cancel"
                            cancel-button-text="cancel"
                            ng-hide="showPassword==true")
                              button.btn.btn-block.btn-primary#save(type='submit'
                                ng-disabled='accountForm.$invalid || trust.loading')
                                span(ng-hide="trust.loading", l10n) Save
                                span(ng-show="trust.loading && trust.state==='saving'", l10n) Saving...
                        .col-xs-6.col-sm-5(ng-show="trust.loading && trust.state==='removing'")
                          .row
                            .col-xs-12
                              button.btn.btn-block.btn-danger(disabled, l10n) Removing...
                        .col-xs-3.col-sm-4.col-md-3(ng-hide="trust.loading")
                          .row.text-right
                            .col-xs-12(ng-show='trust.balance !== "0" && orderbookStatus === "exists"')
                              rp-confirm(
                              action-text="Are you sure you want to remove this gateway? Ripple Trade will attempt to convert the remaining balance of {{ trust.balance }} {{ trust.currency }} into XRP. This action can't be undone."
                              action-button-text="Convert balance and remove"
                              action-button-css="btn btn-default btn-danger"
                              action-function="delete_account()"
                              cancel-button-css="btn btn-cancel"
                              cancel-button-text="cancel"
                              ng-hide="showPassword==true")
                                button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="load_orderbook()", ng-show="!isIncomingOnly()", l10n) Remove
                                span(
                                  rp-popover
                                  rp-popover-placement="bottom"
                                  rp-popover-trigger="hover"
                                  l10n-rp-popover-title="Incoming trust"
                                  l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                  button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="load_orderbook()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                            .col-xs-12(ng-show='trust.balance !== "0" && orderbookStatus === "not"')
                              rp-confirm(
                              action-text="Are you sure you want to remove this gateway? Ripple Trade will return the balance of {{ trust.balance }} {{ trust.currency }} to the issuer. This action can't be undone."
                              action-button-text="Return balance and remove"
                              action-button-css="btn btn-default btn-danger"
                              action-function="delete_account()"
                              cancel-button-css="btn btn-link"
                              cancel-button-text="cancel"
                              ng-hide="showPassword==true")
                                button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="load_orderbook()", ng-show="!isIncomingOnly()", l10n) Remove
                                span(
                                  rp-popover
                                  rp-popover-placement="bottom"
                                  rp-popover-trigger="hover"
                                  l10n-rp-popover-title="Incoming trust"
                                  l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                  button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="load_orderbook()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                            .col-xs-12(ng-show='trust.balance === "0"')
                              button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="delete_account()", ng-show="!isIncomingOnly()", l10n) Remove
                              span(
                                rp-popover
                                rp-popover-placement="bottom"
                                rp-popover-trigger="hover"
                                l10n-rp-popover-title="Incoming trust"
                                l10n-data-content="You can't delete incoming trust lines. Incoming trust lines are when other Ripple users trust you.")
                                button.btn.btn-block.btn-danger.btn-xs.submit(type="button", ng-click="delete_account()", ng-show="isIncomingOnly()", disabled, l10n) Remove
                        .col-xs-3
                          a.btn.btn-block.btn-cancel(href="", ng-click="cancel()"
                            ng-disabled="trust.loading", l10n) cancel
